{literal}
<script type="text/javascript" language="JavaScript">
<!--
function updateName(title) {
	var val = title.value;
	document.getElementById('systemName').value = val.replace(/ /g,"_").toLowerCase();
}
function updateEnumList() {
	for (var i = 0; i < enumList.length; i++) {
		addListRow(enumList[i]);
	}

}
function addListRow(data) {
	if (!data['key']) {
		var key = document.getElementById('enumTable').tBodies[0].rows.length+1;
		data['key'] = key;
	}
	if (!data['sort']) {
		var sort = document.getElementById('enumTable').tBodies[0].rows.length+1;
		data['sort'] = sort;
	}
	var row = document.getElementById('editTemplate').getElementsByTagName('tr').item(0).cloneNode(true);
	var spacer = row.getElementsByTagName('div')[0];
	spacer.style.marginLeft = data['depth'] +'0px';
	var inputs = row.getElementsByTagName('input');
	var c = document.getElementById('enumTable').tBodies[0].getElementsByTagName('tr').length;
	for(var i = 0; i < inputs.length; i++) {
		if (inputs[i].name != '') {
			var n = inputs[i].name;
			inputs[i].name = "enumList["+c+"]["+inputs[i].name+"]";
			if (data[n]) {
				if (inputs[i].className != 'static') {
					if (inputs[i].type == 'checkbox') {
						if (data[n] == 1) {
							inputs[i].checked = true;
							inputs[i].defaultChecked = true;
						}
						else {
							inputs[i].checked = false;
						}
					}
					else {
						inputs[i].value = data[n];
					}
				}
			}
		}
	}
	var selects = row.getElementsByTagName('select');
	for(var i = 0; i < selects.length; i++) {
		if (selects[i].name != '') {
			var n = selects[i].name;
			selects[i].name = "enumList["+c+"]["+selects[i].name+"]";
			if (data[n]) {
				selects[i].value = data[n];
			}
		}
	}

	document.getElementById('enumTable').tBodies[0].appendChild(row);
}

function down(img) {
	var cell = img.parentNode.parentNode;
	current = new Number(cell.getElementsByTagName('input').item(0).value).valueOf();
	to = current +1;
	if (to < cell.parentNode.parentNode.rows.length) {
		moveRow(cell.parentNode,current,to);
	}
}
function  up(img) {
	var cell = img.parentNode.parentNode;
	current = new Number(cell.getElementsByTagName('input').item(0).value).valueOf();
	to = current -1;
	if (to >= 0) {
		moveRow(cell.parentNode,current,to);
	}
}
function  increaseDepth(img) {
	var cell = img.parentNode.parentNode;
	current = new Number(cell.getElementsByTagName('input').item(0).value).valueOf();
	var currentRowId = Number(cell.parentNode.getElementsByTagName('input').item(0).value).valueOf();
	to = current +1;
	if (to >= 0 && to <2) {
		tableRows = img.parentNode.parentNode.parentNode.parentNode.getElementsByTagName('tr');
		var lastRowId = 0;
		for (var i=0; i<tableRows.length;i++) {
			var loopRowId = Number(tableRows[i].getElementsByTagName('input').item(0).value).valueOf();
			if(loopRowId == currentRowId && lastHigherRowId != 0) {
				cell.parentNode.getElementsByTagName('input').item(1).value = lastHigherRowId;
			}
			if (Number(tableRows[i].getElementsByTagName('input').item(1).value).valueOf() == 0) {
			lastHigherRowId = loopRowId;
			}
		}
		cell.getElementsByTagName('input').item(0).value = to;
		var spacer = cell.parentNode.getElementsByTagName('div').item(0);
        	spacer.style.marginLeft = to +'0px';
	}
	
}
function  decreaseDepth(img) {
        var cell = img.parentNode.parentNode;
        current = new Number(cell.getElementsByTagName('input').item(0).value).valueOf();
        to = current -1;
        if (to >= 0 && to < 2) {
                cell.getElementsByTagName('input').item(0).value = to;
                var spacer = cell.parentNode.getElementsByTagName('div').item(0);
                spacer.style.marginLeft = to +'0px';
        }
        
}

function moveRow(row,current,to) {
	var tbody = row.parentNode;

	var nrow = row.cloneNode(true);
	var inputs = nrow.getElementsByTagName('input');

	var check = /\[sort\]$/;
	for(var i =0; i < inputs.length; i++) {
		if (check.test(inputs[i].name)) {
			inputs[i].value = to;
		}
	}

	if (to > current) {
		tbody.insertBefore(nrow,tbody.rows[to+1]);
	}
	else {
		tbody.insertBefore(nrow,tbody.rows[to]);
	}
	tbody.removeChild(row);

	// update sort values
	var inputs = tbody.rows[current].getElementsByTagName('input');
	for(var i =0; i < inputs.length; i++) {
		if (check.test(inputs[i].name)) {
			inputs[i].value = current;
		}
	}

}
{/literal}var enumList = {$enumList};
-->
</script>

<div id="editTemplate" style="display:none">
	<table>
	<tr>
		{foreach from=$enumDef item=info key=key}
		{if $info}
		<td>

		
			{if !$doneHidden}
				{foreach from=$enumDef item=hinfo key=hkey}
					{if $hinfo.type === 'hidden'}
						<input type="hidden" name="{$hkey}">
					{/if}
				{/foreach}
				{assign var='doneHidden' value=1}
			{/if}
			{if !$info.type}
			<div id="spacer">
			<input name="{$key}" size="{$info.size}">
			</div>
			{elseif $info.type === 'order'}
			<input type='hidden' name="{$key}">
			<div style='text-align:center'>
				{clni_img name="stock/s_asc.png" border=0 onclick="up(this)"}
				{clni_img name="stock/s_desc.png" border=0 onclick="down(this)"}
			</div>
			{elseif $info.type === 'depth'}
			<input type='hidden' name="{$key}">
			<div style='text-align:center'>
				{clni_img name="stock/s_asc.png" border=0 onclick="increaseDepth(this)"}
				{clni_img name="stock/s_desc.png" border=0 onclick="decreaseDepth(this)"}
			{elseif $info.type === 'boolean'}
			<div style='text-align:center'>
				<input type='hidden' name="{$key}" value="0" class="static"><input type="checkbox" name="{$key}" value="1">
			</div>
			{elseif $info.template}
			<div style='text-align:center'>
				{$info.template}
			</div>
			{/if}
		</td>
		{/if}
		{/foreach}
			
	</tr>
	</table>
</div>
{clni_form action=$FORM_ACTION process=$PROCESS}
<h3>Enumeration Details for <i>{$ed->get('title')}</i></h3>
		<fieldset class="radio">
<table>
	<tr>
		<td>Title:&nbsp;</td>
		<td><input id="title" type="text" name="EnumerationDefinition[title]" size="30" value="{$ed->get('title')}" {if $ed->get('id') == 0}onkeyup="updateName(this)"{/if}></td>
	</tr>
	<tr>
		<td>System Name:&nbsp;</td>
		<td><input id="systemName" type="text" name="EnumerationDefinition[name]" size="30" value="{$ed->get('name')}"></td>
	</tr>
	<tr>
		<td>Type:&nbsp;</td>
		<td><input id="type" type="text" name="EnumerationDefinition[type]" size="30" value="{$ed->get('type')}"></td>
	</tr>
</table>
{clni_register_validation_rule id="systemName"}
{clni_register_validation_rule id="title"}
{clni_register_validation_rule id="type"}

{if $enum->type}
{$enum->type->widget()}
{/if}

{if $ed->get('id') > 0}
<h3>Enumeration Values:</h3>
<table cellspacing=0 cellpadding=1 border=0 id="enumTable">
	<thead>
	<tr>
		{foreach from=$enumDef item=info}
			{if $info}
				<th>{$info.label}</th>
			{/if}
		{/foreach}
	</tr>
	</thead>
	<tbody>
	</tbody>
</table>
{literal}<input type="button" onclick="addListRow({status:1})" value="Add Enum Value" />{/literal}
<script type="text/javascript">
	updateEnumList();
</script>
{/if}



<p>
{if $ed->get('id') > 0}
<input type="submit" name="submit" value="Update Enumeration">
{else}
<input type="submit" name="submit" value="Add Enumeration">
{/if}
</p>
	</fieldset>
</form>
